<div class="showcase-4v1 relative" *reqRolesIf="content">
  @if (content.text) {
    <app-text [attr.data-path]="'text'" [content]="content.text" />
  }
  <div class="inner grid grid-cols-12">
    @for (item of elements; track item; let i = $index) {
      <div class="col-span-12 sm:col-span-6 md:col-span-3">
        <div class="style04 inv-stats">
          <div class="stats-icon">
            @if (item.icon) {
              <app-icon [content]="item.icon" />
            }
            @if (item.img) {
              <app-img [attr.data-path]="'elements.' + i + '.img'" [content]="item.img" />
            }
          </div>
          <div class="stats-count">
            <app-number-animate
              [attr.data-path]="'elements.' + i + '.digit'"
              [content]="item.digit"
            />
          </div>
          @if (item.title) {
            <div
              class="stats-title"
              [contentedit]="'elements.' + i + '.title'"
              [innerHTML]="item.title"
            ></div>
          }
          @if (item.desc) {
            <div
              class="stats-desc"
              [contentedit]="'elements.' + i + '.desc'"
              [innerHTML]="item.desc"
            ></div>
          }
        </div>
      </div>
    }
  </div>
</div>
